<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			window.onload=function(){
				var ul=document.getElementById("ul");
			//myClick函数在40行定义
				myClick("btn",function(){					
					var li=document.createElement("li");
				/*第一种增加王五的方法*/
					/*var text=document.createTextNode("王五");
					li.appendChild(text);*/
				/*第二种增加王五的方法*/
					li.innerHTML="王五";
				/*增加进去*/
					ul.appendChild(li);
				})
				myClick("btn01",function(){
					var ls=document.getElementById("ls");
					var li=document.createElement("li");
					var text01=document.createTextNode("ben10");
					li.appendChild(text01);
					ul.insertBefore(li,ls);
				})
				myClick("btn02",function(){
					var zs=document.getElementById("zs");
					var li=document.createElement("li");
					var text02=document.createTextNode("黄明");
					li.appendChild(text02);
					ul.replaceChild(li,zs);
				})
				myClick("btn03",function(){
					var ls=document.getElementById("ls");
					ls.parentNode.removeChild(ls);
				})
				
			};
		//定义myClick函数
			function myClick(idStr,fun){
				var btn=document.getElementById(idStr);
				btn.onclick=fun;
			}
		</script>
	</head>
	<body>
		<ul id="ul">
			<li id="zs">张三</li>
			<li id="ls">李四</li>
		</ul>
		
		<button id="btn" name="anniu">在后面增加王五</button>
		<button id="btn01" name="anniu">在李四前增加ben10</button>
		<button id="btn02" name="anniu">让黄明替换张三</button>
		<button id="btn03" name="anniu">删除李四</button>
	</body>
</html>
